<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="../../yl/index.css" />
    <link rel="stylesheet" href="../../yl/style.css" />
    <link rel="stylesheet" href="../../style/free.css" />
    <title>景点详情</title>
    <style>
        body {
            background-color: rgb(244, 244, 244);
        }
    </style>
</head>

<body>
    <div id="app" class="flex flex-column pb-3" v-clock>
        <template v-if="true">
            <el-image class="w-100" :src="photo + formData.Picture_URL" fit="contain"></el-image>
            <div class="mx-3 py-3 bg-white shadow rounded" style="margin-top: -50rem;z-index: 2;">
                <div class="mx-3 flex">
                    <span class="font-md font-weight-bold flex-shrink">景点名称：</span>
                    <span class="font-md">{{formData.Scenic_Spot_Detail_Name}}</span>
                </div>
                <div class="mx-3 flex mt-1 text-muted ">
                    <span class="font-sm font-weight-bold flex-shrink">营业时间：</span>
                    <span class="font-sm">{{formData.Start_Hours}}~{{formData.End_Hours}}</span>
                </div>
            </div>
            <div class="mx-3 py-3 mt-3 bg-white shadow rounded">
                <div class="mx-3 font-md font-weight-bold">景点历史</div>
                <div class="mx-3">
                    <span class="ml-3 font flex-shrink">{{formData.Scenic_Spot_History}}</span>
                </div>
            </div>
            <div class="mx-3 py-3 mt-3 bg-white shadow rounded">
                <div class="mx-3 font-md font-weight-bold">语音导游</div>
                <div class="mx-3">
                    <el-tabs v-model="action">
                        <el-tab-pane class="mt-1" v-for="(value,key) in tabs" :key="key" :label="value" :name="key">
                            <audio v-for="(item,index) in tableData.filter(i=>i.Attachment_Type == key)" :key="index" controls
                                :src="photo + item.Attachment_URL" class="w-100 mb-1"></audio>
                        </el-tab-pane>
                    </el-tabs>
                </div>
            </div>
            <div class="mx-3 py-3 mt-3 bg-white shadow rounded">
                <div class="mx-3 font-md font-weight-bold">景点详情</div>
                <div class="mx-3">
                    <div v-html="formData.Main"></div>
                </div>
            </div>
        </template>
    </div>
    <script src="../../utils/utils.js"></script>
    <script src="../../utils/mixins.js"></script>
    <script src="../../config/config.js"></script>
    <script src="../../yl/vue.js"></script>
    <script src="../../yl/index.js"></script>
    <script src="../../yl/zh-cn.mjs"></script>
    <script src="../../yl/index.iife.min.js"></script>
    <script src="../../yl/jquery.min.js"></script>
    <script src="../../utils/jquery.cookie.js"></script>
    <script src="../../api/request.js"></script>
    <script src="../../utils/jweixin.js"></script>
    <script src="./js/index.js"></script>
</body>

</html>